import useEventListener from './useEventListener';
import { toValue } from 'vue'
import { throttle } from 'lodash-unified'

const useCheckScrollToBottom = (ele, callback = () => void 0, options = {}) => {
    const { threshold = 500 } = options
    let isLoad = false
    let height = 0
    let stopListener = () => void 0
    stopListener()
    stopListener = useEventListener(document, "scroll", throttle(() => {
        const container = toValue(ele)
        if (container.scrollHeight - container.scrollTop <= container.clientHeight + threshold && !isLoad) {
            isLoad = true
            height = container.scrollHeight
            callback()
        } else if (container.scrollHeight > height) {
            height = container.scrollHeight
            isLoad = false
        }
    }), true)
    return stopListener
}

export default useCheckScrollToBottom